<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <script src="../../libraries/p5/p5.min.js" type="text/javascript"></script>

    <script src="../../libraries/quicksettings/quicksettings.js" type="text/javascript"></script>
    <script src="../../libraries/generative-design-library/generative-design-library.js" type="text/javascript"></script>

    <script src="sketch.js" type="text/javascript"></script>
    <script src="gui.js" type="text/javascript"></script>

    <link href="../../styles/main.css" rel="stylesheet" type="text/css">

    <!-- help tooltip start -->
    <script src="../../libraries/jquery/jquery.js" type="text/javascript"></script>
    <script type="text/javascript" src="../../libraries/tooltipster/tooltipster.bundle.js"></script>
    <link rel="stylesheet" type="text/css" href="../../libraries/tooltipster/tooltipster.bundle.css" />
    <link rel="stylesheet" type="text/css" href="../../libraries/tooltipster/tooltipster-sideTip-noir.min.css" />
    <script src="../../libraries/help-tooltip.js" type="text/javascript"></script>
    <!-- help tooltip end -->

    <style media="screen">
      body {
        background: black;
      }
      video {
        object-fit: fill;
        width: 100%;
        height: auto;
      }
      .subtitle {
        font-family: sans-serif;
        color: white;
        text-align: center;
        font-size: 10px;
        display: flex;
        align-items: flex-end;
        justify-content: center;
        text-shadow: 1px 1px 0 black;
      }
    </style>
  </head>
  <body>
    <span id="help" data-tooltip-content="#help-content">?</span>
  </body>
</html>
